@charset "utf-8";

/* nav */
.nav{width: 200px;height: 100%;background: #f5f5f5;transition: all .3s;}
.nav a{font-size: 16px;display: block;overflow: hidden;padding-left: 20px;line-height: 40px;max-height: 40px;color: #696969;transition: all .3s;}
.nav a span{margin-left: 30px;}
.nav-item{font-size: 20px;position: relative;}
.nav-item.nav-show{border-bottom: none;}
.nav-item ul{display: none;background: rgba(0,0,0,.1);}
.nav-item.nav-show ul{display: block;}
.nav-item>a:before{content: "";position: absolute;left: 0px;width: 2px;height: 46px;background: #34A0CE;opacity:0;transition: all .3s;}
.nav .nav-icon{font-size: 20px;position: absolute;margin-left:-1px;}

/*---------------------*/
.nav-show .nav-more{transform:rotate(90deg);}
.nav-show,.nav-item>a:hover{color: #4169e1;background:rgba(0,0,0,.1);}
.nav-show>a:before,.nav-item>a:hover:before{opacity:1;}
.nav-item li:hover a{color: #4169e1;background: rgba(0, 0, 0,.1);}
 
